<template>
    <el-container>
        <el-aside width="230px"  class="main-slider-menu" :class="sliderIsCollapse ? 'slider-menu-collapse' : ''" style="z-index: 2">
            <el-header class="side_logo">
                <div class="wh_full menuHearder">
                    <img src="../assets/img/bzxt_logo.png" alt="" srcset="">
                </div>
                <!-- <div class="side_logo_container">
                    <img src="../assets/logo_small.png" alt="">
                </div>
                <div class="side_title" v-if="!sliderIsCollapse">
                    四维运营平台
                </div> -->
            </el-header>
            <w-sidebar :collapse="sliderIsCollapse"/>
        </el-aside>
        <el-container>
            <el-header class="main-header">
                <v-head></v-head>
            </el-header>
            <w-router-view :tabMode='true' :isCachePage="true" style=""/>
        </el-container>
    </el-container>
</template>

<script>
import vHead from '../components/header.vue'
export default {
  components: {
    vHead
  },
  methods: {},
  computed: {
    sliderIsCollapse () {
      return this.$store.state.sliderIsCollapse
    }
  }
}
</script>
<style lang="scss" scoped rel="stylesheet/scss">
    @import "../assets/css/config";
    .body-main{
        padding: 40px !important;
    }
    .main-header{
        height: 38px !important;
        background-color: #FFF;
        display: flex;
        width: 100%;
        box-sizing: border-box;
        /*border-bottom: #20a0ff 1px solid;*/
        // box-shadow: 0 0 2px 0 rgba(0, 21, 41, .35);  //2020/08/11 tabs样式调整
    }
    .el-container{
        min-height:0;
    }
    .slider-menu-collapse{
        width: 64px !important;
        .side_logo{
            padding-left:5px;
            padding-right: 2px;
        }
    }
    .side_logo{
        height: 80px !important;
        -webkit-transition: all .5s;
        transition: all .5s;
        background: #F7AB48;
        color: #FFF;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .side_logo_container{
        width: 43px;
        height: 28.8px;
    }
    .side_logo_container img{
        width: 100%;
    }

    @font-face {
        font-family: "titleFamily";
        src: url('../assets/fonts/Acens.woff.ttf');
    }
    .side_title{
        color: #FFFFFF;
        font-size: 20px;
        text-indent: 0.3em;
        margin-top: 2px;
        font-family: "titleFamily";
    }
    /*.main-slider-menu{*/
        /*width: 180px !important;*/
    /*}*/
</style>
